﻿<template>
    <div class="container" style="width:99%;margin-top:-25px;">
	<!-- 查询条件 -->
    <div class="query-box">
        <el-form :model="queryBox" status-icon ref="queryBox">
          <el-row>
            <el-col :span="4">
              <el-form-item label="" prop="customerNumber">
                <el-input v-model="queryBox.customerNumber" placeholder="客户编号">
                    <template slot="prepend">客户编号</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <div class="depart-box">
                  <div class="slect-title">跟进人</div>
                  <el-autocomplete
                    v-model="userName"
                    :fetch-suggestions="querySearchAsync2"
                    placeholder="请输入内容"
                    @select="handleSelect2"
                    
                  ></el-autocomplete>
              </div>
            </el-col>
            <el-col :span='7'>
               <div class="depart-box">
                  <div class="slect-title">跟进时间</div>
                   <el-date-picker
                      v-model="trackingDate"
                      type="daterange"
                      range-separator="至"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                      :default-time="['00:00:00', '23:59:59']" 
                      value-format="yyyy-MM-dd HH:mm:ss" 
                      format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                </div>
            </el-col>
          </el-row>
        </el-form>
        <div class="from-btns">
            <kt-button :label="$t('action.reset')" perms="true" type="primary" @click="reset('queryBox')"/>
            <kt-button :label="$t('action.search')" perms="true" type="primary" @click="search"/>
        </div>
    </div>
	<!--表格内容栏-->
	<Crm-table  class="table-width" :showBatchDelete='false' CustomerFollowlogstu width="400" perms="true"
		:data="pageResult" :columns="columns" :loading='loading'
		@findPage="findPage" @handleSee="handleSee">
	</Crm-table >

  </div>
</template>
<script>
import PopupTreeInput from "@/components/PopupTreeInput";
import distributionPop from "@/components/distributionPop";
import KtButton from "@/views/Core/KtButton";
import CrmTable from "@/views/Core/CrmTable";
import CrmSwitch from "@/views/Core/CrmSwitch";
import CustomerOwnership from "@/components/CustomerOwnership";
import { CodeToText } from "element-china-area-data";
import axios from "axios";
export default {
  name: "Chinaedu",
  components: {
    PopupTreeInput,
    CrmTable,
    KtButton,
    CrmSwitch,
    distributionPop,
  },
  data() {
    return {
      size: "small",
      filters: {
        name: ""
      },
      userName:'',
      showBatchDelete:false,
      student_data_from_options:[],
      student_progress_options:[],
      student_data_from_type_options:[],
      student_type_options:[],
      // 查询条件
      queryBox: {},
      width: 200,
      columns: [
        { type: "index", label: "序号", minWidth: 50 },
        { prop: "customerNumber", label: "客户编号", minWidth: 180 },
        { prop: "agentName", label: "意向客户", minWidth: 180 },
        { prop: "customerSource", label: "客户来源", minWidth: 100 },
        { prop: "customerType", label: "客户类型", minWidth: 120 },
        { prop: "customerProgress", label: "客户进展", minWidth: 70 },
        { prop: "creater", label: "跟进人", minWidth:100 },
        { prop: "diqu", label: "地区", minWidth: 190 },
        { prop: "createDate", label: "创建时间", minWidth: 180 },
        { prop: "trackingDate", label: "最新跟进时间", minWidth: 180 }
      ],
      pageResult: {
        content: []
      },
      roles: [],
      trackingDate:'',
      loading: false, // 加载标识
    };
  },
  methods: {
    // 获取分页数据
    findPage: function(data) {
      if (data !== null) {
        this.loading=true
        this.pageRequest = data.pageRequest;
      }
      this.queryBox.pageSize = this.pageRequest.pageSize;
      this.queryBox.pageNum = this.pageRequest.pageNum;
      this.$api.agent.investmentTrackingInfoChinaedu(this.queryBox)
        .then(res => {
          let content = {'content':res.investmentTrackingVos,'totalSize':res.total};
          this.pageResult=content;
          this.pageResult.content.forEach(item => {
           if(item.province==null&&item.city==null||item.province=='null'&&item.city=='null'){
              item.diqu=""
            }else{
              item.diqu = item.province + item.city + item.area;
            }
            this.student_data_from_options.forEach(type_item=>{
              if(type_item.key==item.dataFrom){
                item.laiyuan=type_item.value
              } 
            })
            this.student_progress_options.forEach(progress_item=>{
              if(progress_item.key==item.progress){
                item.getprogress=progress_item.value
              }
            })
            // 获取方式对应
            this.student_data_from_type_options.forEach(data_from_type_item=>{
              if(data_from_type_item.key==item.progress){
                item.getType=data_from_type_item.value
              }
            })
            // 客户类型对应
            this.student_type_options.forEach(student_type_item=>{
              if(student_type_item.key==item.type){
                item.type=student_type_item.value
              }
            })
          });
          this.loading=false
        })
        .then(data != null ? data.callback : "");
    },
    // 查询
     search() {
      this.queryBox.trackingStartDate=this.trackingDate[0]
      this.queryBox.trackingStopDate=this.trackingDate[1]
      this.pageRequest.pageNum = 1;
      this.findPage(null)
    },
    // 加载用户角色信息
    findUserRoles: function() {
      this.$api.role.findAll().then(res => {
        // 加载角色集合
        this.roles = res.data;
      });
    },
    // 批量删除
    handleDelete: function(data) {
      this.$api.user
        .batchDelete(data.params)
        .then(data != null ? data.callback : "");
    },
    // 重置
    reset(queryBox){      
      this.$refs.queryBox.resetFields();   
      this.trackingDate=''
      this.queryBox.creater=''
      this.queryBox.FollowTime=''
      this.queryBox.trackingStartDate=''
      this.queryBox.trackingStopDate=''
      this.userName=''
      this.queryBox.trackingPeople=''
      this.pageRequest.pageNum = 1;
      this.findPage(null)
    },
    // 查看客户档案
    handleSee(params){
      console.log(params)
      this.dataForm = Object.assign({}, params.row);
      console.log(params)
      this.$router.push({
        path: "/Follow/AgentFollow",
        query:{
          id:params.row.id,
          agentName:params.row.agentName
        }
      });
    },
    // 菜单树选中
    deptTreeCurrentChangeHandle(data, node) {
      this.dataForm.deptId = data.id;
      this.dataForm.deptName = data.name;
    },
    // 菜单树选中
    handleOptionClick() {},
     get_student_data_from() {
      this.$api.agent
        .investment_customer_from()
        .then(res => {
          this.student_data_from_options = res.keyValueList;
        });
    },
    get_student_progress() {
      this.student_progress_options=JSON.parse(localStorage.getItem('investmentProgress'))
    },
    student_progress_change(value) {
      this.queryBox.student_progressValue = value.toString();
    },  
    get_student_type() {
      this.student_type_options=JSON.parse(localStorage.getItem('investmentType'))
    },
    get_student_data_from_type(){
      this.student_data_from_type_options=JSON.parse(localStorage.getItem('investmentDataFromType'))
    },
    student_parent_type_change(value) {
      this.info.studentInfoDetail.studentInfoAttr.parentType = value.toString();
    },
     // 跟进人
    querySearchAsync2(queryString, callback) {
      let restaurants = [{}];
      let results = "";
      this.$api.dropdown.users({ userType: 3 }).then(res => {
        for (let i of res.userInfoList) {
          i.value = i.realName; //将想要展示的数据作为value
        }
        restaurants = res.userInfoList;
        results = queryString
          ? restaurants.filter(this.createFilter2(queryString))
          : restaurants;
        callback(results);
      });
    },
    createFilter2(queryString) {
      return restaurant => {
        return (
          restaurant.realName
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    handleSelect2(item) {
      this.queryBox.trackingPeople = item.id;
    }
  },
  mounted() {
    this.get_student_type()
    this.get_student_data_from()
    this.get_student_progress()
  }
};
</script>
<style >
@import url("../../assets/queryBox.css");
</style>


